import React from 'react'

import { Layout, Menu } from 'antd';
import { UserOutlined, LaptopOutlined, NotificationOutlined } from '@ant-design/icons';


const {  Content, Sider } = Layout;

import {  Route, Link ,Switch} from 'react-router-dom'

import GoodsList from './goodsList.jsx'
import GoodsDetail from './goodsDetail.jsx'

export default class Goods extends React.Component {
  constructor(props) {
    super(props)
    this.state = {}
  }

  render() {
    return <Layout style={{height:'100%'}}>
    <Sider width={200} className="site-layout-background">
      <Menu
        mode="inline"
        defaultSelectedKeys={[window.location.hash.split('/')[2]]}
        style={{ height: '100%', borderRight: 0 }}
      >
        
          <Menu.Item key="427"><Link to='/goods/427/1'>正在热卖</Link></Menu.Item>
          <Menu.Item key="368"><Link to='/goods/368/1'>即将上线</Link></Menu.Item>
          <Menu.Item key="363"><Link to='/goods/363/1'>Top100</Link></Menu.Item>
        
      </Menu>
    </Sider>
    <Layout style={{ paddingLeft: '1px' }}>
    
      <Content
        className="site-layout-background"
        style={{
          padding: 10,
          margin: 0,
          minHeight: 280,
        }}
      >
        <Switch>
        <Route path='/goods/detail/:goods_id' component={GoodsDetail}></Route>
        <Route path='/goods/:cid/:page' component={GoodsList}></Route>
       
        </Switch>
       
      </Content>
    </Layout>
  </Layout>
  }
}